let app = new Vue({
    el: '#app',
    data() {
        return {
            selectAll: false,
            obj: [],
            objAll: [],
            selectChe: [],
            number: 1,
            list: [
                {
                    id: 1,
                    name: '胡打游也',
                    price: 6211,
                    count: 1
                },
                {
                    id: 2,
                    name: '游大胡也',
                    price: 5929,
                    count: 1
                },
                {
                    id: 3,
                    name: '彩色闽大',
                    price: 8921,
                    count: 1
                },
                {
                    id: 4,
                    name: '抓药的信心',
                    price: 9999,
                    count: 1
                }
            ]
        }
    },
    computed: {
        // 计算商品价格的计算属性
        totalPrice: function () {
            let total = 0;

            // 双层循环对子选框数组与数据源做比较，
            // 如果匹配则计算，否则不作为
            // 检测子选框勾起了几个选框
            for (let i = 0; i < this.selectChe.length; i++) {
                for(let j = 0; j < this.list.length; j++){
                    // 检查目前选框对应的商品名称是否在数据源中存在
                    if(this.selectChe[i] === this.list[j].name){
                        // 如果存在，将这一行的数据赋予item
                        let item = this.list[j];
                        // 对这一行的价格和数量进行计算
                        total += item.price * item.count;
                        console.log(this.selectChe[i]);
                    }
                }

            }

            // 如果两个数组数量一致，表示子选框全选 
            // 全选按钮则打钩
            if (this.list.length === this.selectChe.length) {
                this.selectAll = true;
            } else {
                this.selectAll = false;
            }
            // console.log(boo_num);

            // if (boo_num === this.list.length) {
            //     this.onAllYes = true
            //     this.selectAllName = '全不选'
            //     // return 1
            // } else if (boo_num > 0) {
            //     this.onAllYes = false
            //     this.selectAllName = '全选'
            //     // return 2
            // } else {
            //     this.selectAllName = ''
            //     // return 3
            // }
            return total.toString().replace(/\B(?=(\d{3})+$)/g, ',');
        }
    },
    methods: {
        // 购物车为空
        countReduce: function () {
            if (this.number <= 1) return;
            this.number--;
        },
        // 商品操作数量增加
        countAdd: function () {
            this.number++
        },
        // 操作商品减少
        handleReduce: function (index) {
            if (this.list[index].count === 1) return;
            this.list[index].count--;
        },
        // 操作商品数量增加
        handleAdd: function (index) {
            this.list[index].count++;
        },
        // 移除指定的列表项
        handleRemove: function (index) {
            console.log(index);
            let arr = [this.selectChe.length]
            for(let i = 0; i < this.selectChe.length; i++){
                if(this.selectChe[i] !== this.list[index].name){
                    arr[i] + this.selectChe[i]
                }
            }
            console.log(arr);
            console.log(this.list[index].name)
            this.list.splice(index, 1);
        },
        IfSelectAll: function () {
            if (!this.selectAll) {
                for (let i = 0; i < this.list.length; i++) {
                    let name = this.list[i].name
                    this.selectChe.push(name)
                    console.log(this.selectChe);
                }
                // this.selectChe += name
            }else {
                this.selectChe=[]
            }
        },
        addList: function () {
            // console.log('1')
            let id = this.list.length + 1;
            let name = $('#name').val();
            let price = parseFloat($('#price').val());
            let number = this.number;
            console.log(number);
            let obj = {
                id: id,
                name: name,
                price: price,
                count: number
            }

            console.log(obj);
            console.log('id: ' + id + ' name: ' + name + ' price: ' + price + ' number: ' + number);
            this.list.push(obj);


        },

    }
})